<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="UTF-8" />
		<meta http-equiv="X-UA-Compatible" content="IE=edge" />
		<!-- <meta name="viewport" content="width=device-width, initial-scale=1.0"> -->
		<!-- 修改布局视口 width就是设置布局视口, pc端不区分, 只针对移动端  -->
		<!-- <meta name="viewport" content="width=100px" /> -->

		<!-- 布局视口 = 可视视口 : 理想视口 -->
		<!-- 
      user-scalable=no 静止用户缩放, 兼容性不好, 
        一般会和 minimum-scale=1.0, maximum-scale=1.0
    -->
		<meta
			name="viewport"
			content="width=device-width, initial-scale=1.0, 
      user-scalable=no, minimum-scale=1.0, maximum-scale=1.0 "
		/>

		<title>Document</title>
		<style>
			body {
				margin: 0;
				padding: 0;
			}
			.box {
				width: 100px;
				height: 100px;
				background-color: orange;
			}
		</style>
	</head>
	<body>
		<div class="box"></div>
	</body>
</html>
